import React, { Component } from 'react'
import './index.scss'

export default class Stepper extends Component {
  constructor() {
    super();
    this.state = {
      num: 1,
      flag: false
    }
  }
  render () {
    return (
      <div className="stepper">
        <input type="button" value='-' onClick={this.decrease.bind(this)} />
        <input className="numInput" type="button" value={this.state.num} />
        <input type="button" value='+' onClick={this.increase.bind(this)} />
      </div>
    )
  }
  increase () {
    this.setState({
      num: (this.state.num === this.props.max) ? this.props.max : (this.state.num + 1)
    }, function () {
      this.props.getStepValue(this.state.num)
    });

  }
  decrease () {
    if (this.state.num <= 1) {
      return
    }
    this.setState({
      flag: false,
      num: (this.state.num === this.props.min) ? this.props.min : (this.state.num - 1)
    }, function () {
      this.props.getStepValue(this.state.num)
    })
  }
}





